<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page import="org.springframework.context.ApplicationContext"%>
<%@ page import="org.springframework.web.context.support.WebApplicationContextUtils" %>
<%@ page import="org.springframework.web.servlet.support.RequestContextUtils" %>
<%@ page import="it.cst.entity.service.MatchService" %>
<%@ page import="it.cst.entity.service.GroupService" %>
<%@ page import="it.cst.entity.service.UserService" %>
<%@ page import="it.cst.entity.service.PlayerService" %>
<%@ page import="it.cst.entity.service.RoleService" %>
<%@ page import="java.util.List" %>
<%@ page import="it.cst.entity.*" %>
<%@ page import="it.cst.util.*" %>
<%@ page import="it.cst.entity.controller.MatchController" %>
<%@ page import="java.util.Collection"%>
<%@ page import="org.springframework.security.core.context.SecurityContextHolder"%>
<%@ page import= "java.util.List" %>
<%
Collection auth = SecurityContextHolder.getContext().getAuthentication().getAuthorities();
ApplicationContext ctx = RequestContextUtils.getWebApplicationContext(request);
UserService us = (UserService) ctx.getBean("userService");
List<User> lu = us.listUser();
%>
<!DOCTYPE html> 
<html> 
	<head> 
	<title>CST</title> 
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0-beta.1/jquery.mobile-1.2.0-beta.1.min.css" />
	<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.2.0-beta.1/jquery.mobile-1.2.0-beta.1.min.js"></script>
	<script>
	function searchNext(lastid){
		document.getElementById("idMatch").value = lastid;
		document.getElementById("operator").value = '<';
		document.getElementById("order").value = 'DESC';
		document.getElementById("navSearchMatch").submit();
	}
	function searchPrev(firstid){
		document.getElementById("idMatch").value = firstid;
		document.getElementById("operator").value = '>';
		document.getElementById("order").value = 'ASC';
		document.getElementById("navSearchMatch").submit();
	}
	function deleteMatchs(){
	   var elLength = document.navSearchMatch.elements.length;
	   var ids = '';
	   var almostOneChecked = false;
	   for (i=0; i<elLength; i++)
	    {   
	    	var type = navSearchMatch.elements[i].type;
	        if (type=="checkbox" && navSearchMatch.elements[i].checked){
	        	ids = ids + ';' + navSearchMatch.elements[i].id;
	            almostOneChecked = true;
	        }
	    }
	    if(almostOneChecked){
	    	document.getElementById("matchsToDelete").value = ids;
	    	document.getElementById("navSearchMatch").action = 'deleteMatchs';
	    	document.getElementById("navSearchMatch").submit();
	    }
	}
	function filterMatchs(){
		document.getElementById("dateFilterMatchs").value = document.getElementById("mydate").value;
		document.getElementById("userFilterMatchs").value = document.getElementById("userToSearch").value;
		document.getElementById("navSearchMatch").action = 'filterMatchs';
		document.getElementById("navSearchMatch").submit();
	}
	</script>	
	</head>
	<body> 
<div data-role="page">
	<div data-role="header">
		<h1>Ricerca Partite</h1>
	</div><!-- /header -->
	<form name="navSearchMatch" id="navSearchMatch" method="POST" action="navSearchMatch" data-ajax="false"> 
		<input type="hidden" id="idMatch" name="idMatch" value=""></input>
		<input type="hidden" id="operator" name="operator" value=""></input>
		<input type="hidden" id="order" name="order" value=""></input>
		<input type="hidden" id="matchsToDelete" name="matchsToDelete" value=""></input>
		<input type="hidden" id="dateFilterMatchs" name="dateFilterMatchs" value="${searchMatch.dateFilter}"></input>
		<input type="hidden" id="userFilterMatchs" name="userFilterMatchs" value="${searchMatch.userFilter}"></input>
		<div data-role="content">
		   <table style="width:100%;align:center;border-collapse:collapse">
		   	<tr>
		   		<td style="width:50%">
		   			<label for="mydate"><b>Data</b></label>
		   			<input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "calbox"}' value="${searchMatch.dateFilter}">
		   		</td>
		   		<td style="width:50%">
				   	<label for="userToSearch"><b>Giocatore</b></label>
				   	<select name="userToSearch" id="userToSearch" data-native-menu="false">
				      	<option value=""></option>
				      	<c:forEach items="${searchMatch.allUserList}" var="user">
						      	<c:choose>
							      	<c:when test="${user.username == searchMatch.userFilter}">
							      		<option selected value="${user.username}">${user.firstname} ${user.lastname}</option>
	       							</c:when>
							      	<c:when test="${user.username != searchMatch.userFilter}">
							      		<option value="${user.username}">${user.firstname} ${user.lastname}</option>
	       							</c:when>
       							</c:choose>
						</c:forEach>      	
				    </select>
		   		</td>
		   	</tr>
		   </table>
		   <table style="width:100%;align:center;border-collapse:collapse">
				<tr bgcolor="lightgrey">
					<td style="width:30%"><b>Data</b></td>
					<td style="width:50%"><b>Giocatori</b></td>
					<td style="width:20%"><b>Punteggio</b></td>
				</tr>
				<tr>
					<td style="width:30%"></td>
					<td style="width:50%"></td>
					<td style="width:20%"></td>
				</tr>
				<c:forEach items="${searchMatch.objList}" var="matchSearchItem">
					<tr bgcolor="#E0E0E0">
						<td style="width:30%">
							<input type="checkbox" name="${matchSearchItem.matchId}" id="${matchSearchItem.matchId}" class="custom" />
							<label for="${matchSearchItem.matchId}">${matchSearchItem.dateTime}</label>
						</td>
						<td style="width:50%">
							<table style="width:100%;align:center;border-collapse:collapse">
								<tr bgcolor="red"><td><font color="white">${matchSearchItem.userRedDefense.firstname} ${matchSearchItem.userRedDefense.lastname}</font></td></tr>
								<tr bgcolor="red"><td><font color="white">${matchSearchItem.userRedAttack.firstname} ${matchSearchItem.userRedAttack.lastname}</font></td></tr>
								<tr bgcolor="blue"><td><font color="white">${matchSearchItem.userBluDefense.firstname} ${matchSearchItem.userBluDefense.lastname}</font></td></tr>
								<tr bgcolor="blue"><td><font color="white">${matchSearchItem.userBluAttack.firstname} ${matchSearchItem.userBluAttack.lastname}</font></td></tr>
							</table>
						</td>
						<td style="width:20%">
							<table style="width:100%;align:center;border-collapse:collapse">
								<tr bgcolor="red"><td><font color="red" style="text-shadow:none">0</font></td></tr>
								<tr bgcolor="red"><td><font color="white">${matchSearchItem.redScore}</font></td></tr>
								<tr bgcolor="blue"><td><font color="blue" style="text-shadow:none">0</font></td></tr>
								<tr bgcolor="blue"><td><font color="white">${matchSearchItem.bluScore}</font></td></tr>
							</table>
						</td>														
					</tr>
				</c:forEach>
		   </table>
		   <table style="width:100%;align:center;border-collapse:collapse">
		   	<tr>
		   		<c:if test="${searchMatch.hasNextItems}">
				   	<td>
			   			<input type="button" value="Next" onclick="searchNext(${searchMatch.lastItem.id})" data-ajax="false"></input>
			   		</td>
				</c:if>
		   		<c:if test="${searchMatch.hasPrevItems}">
			   		<td>
			   			<input type="button" value="Prev" onclick="searchPrev(${searchMatch.firstItem.id})" data-ajax="false"></input>
			   		</td>
				</c:if>			   		
		   	</tr>
		   </table>
		   <table style="width:100%;align:center;border-collapse:collapse">
		   	<tr>
		   		<td>
		   			<center><input type="button" value="Filtra" onclick="filterMatchs()" data-ajax="false"></input></center>
		   		</td>
		   		<td>
		   			<center><input type="button" <%if(!auth.toString().contains("ROLE_ADMIN")){%>disabled <%}%> value="Elimina" onclick="deleteMatchs()" data-ajax="false"></input></center>
		   		</td>
		   	</tr>
		   </table>
		   <table style="width:100%;align:center;border-collapse:collapse">
		   	<tr>
		   		<td>
		   			<center><a href="home" data-role="button" data-transition="slidefade">Home</a></center>
		   		</td>
		   	</tr>
		   </table>
		</div><!-- /content -->
	</form>
</div><!-- /page -->
</body>
</html>